<!DOCTYPE html>
<html style="font-size: 23.4375px;">
<head>
    <include file="./public/header.html"/>
    <link href="/style/css/zengjia_ka.css" rel="stylesheet">
     <style>
         td[data-v-42392bfc] {
             height: 55px;
             width : 132px;
         }

     </style>
</head>

<body style="font-size: 27.287px;">
<div id="app">
    <div id="shadow" style="display: none;"></div>
    <header class="top"><span style="display: none;">加载中...</span> <span>绑定银行卡</span> <!---->
        <div class="iconfont back" style="display: none;"></div>
        <a href="{:U('Users/managebankcard2')}" class="iconfont back" style=""></a> </header>

    <div data-v-42392bfc="" class="main" s="[object Object]">
        <table data-v-42392bfc="">
            <tbody data-v-42392bfc="">
            <tr data-v-42392bfc="">
                <td data-v-42392bfc="">选择银行</td>
                <td data-v-42392bfc="">
                    <select data-v-42392bfc="" tag="银行" class="va124 diyselect sb" id="yinhang"  name="yinhang">
                    <option data-v-42392bfc="" value="" class="selected" >请选择银行</option>
                    <option data-v-42392bfc="" value="1">工商银行</option>
                    <option data-v-42392bfc="" value="2">建设银行</option>
                    <option data-v-42392bfc="" value="3">农业银行</option>
                    <option data-v-42392bfc="" value="4">民生银行</option>
                    <option data-v-42392bfc="" value="5">招商银行</option>
                    <option data-v-42392bfc="" value="6">交通银行</option>
                    <option data-v-42392bfc="" value="7">中国银行</option>
                    <option data-v-42392bfc="" value="8">邮政储蓄</option>
                    <option data-v-42392bfc="" value="9">中信银行</option>
                    <option data-v-42392bfc="" value="10">兴业银行</option>
                    <option data-v-42392bfc="" value="11">华夏银行</option>
                    <option data-v-42392bfc="" value="12">浦发银行</option>
                    <option data-v-42392bfc="" value="13">广发银行</option>
                    <option data-v-42392bfc="" value="14">平安银行</option>
                    <option data-v-42392bfc="" value="15">光大银行</option>
                    <option data-v-42392bfc="" value="17">农商银行</option>
                </select> <i data-v-42392bfc="" class="iconfont unfold"></i></td>
            </tr>
            <tr data-v-42392bfc="">
                <td data-v-42392bfc="" style=" height:2px;border:none;border-top:2px solid ghostwhite;">开户省份</td>
                <td data-v-42392bfc="">
                    <select data-v-42392bfc="" name="province" id="province" onchange="loadRegion(city)">
                        <option value="" selected>省份/直辖市</option>
                        <volist name="province" id="vo">
                            <option value="{$vo.id}" >{$vo.name}</option>
                        </volist>
                    </select>
                <i data-v-42392bfc="" class="iconfont unfold"></i>
                </td>
            </tr>
            <tr data-v-42392bfc="">
                <td data-v-42392bfc="" style=" height:2px;border:none;border-top:2px solid ghostwhite;">开户城市</td>
                <td data-v-42392bfc="">
                    <select data-v-42392bfc="" name="city" id="city">
                        <option value="" selected>城市</option>
                    </select>
                    <i data-v-42392bfc="" class="iconfont unfold"></i>
                </td>
            </tr>

            <tr data-v-42392bfc="">
                <td data-v-42392bfc="">开户人姓名</td>
                <td data-v-42392bfc="">
                    <input data-v-42392bfc="" id="name" type="text" tag="开户人姓名" value="" placeholder="请输入银行卡的姓名" class="va124" name="RealName">
                </td>
            </tr>
            <tr data-v-42392bfc="">
                <td data-v-42392bfc="">银行卡号</td>
                <td data-v-42392bfc="">
                    <input data-v-42392bfc="" type="tel" id="kahao1" tag="银行卡号" value="" placeholder="请输入银行卡的卡号" class="va124" name="BankNum">
                </td>
            </tr>
            <tr data-v-42392bfc="">
                <td data-v-42392bfc="">确认卡号</td>
                <td data-v-42392bfc="">
                    <input data-v-42392bfc="" type="tel" id="kahao2" tag="确认卡号"  placeholder="请再次输入银行卡号" class="va124" >
                </td>
            </tr>
            <tr data-v-42392bfc="">
                <td data-v-42392bfc="">安全密码</td>
                <td data-v-42392bfc="">
                    <input data-v-42392bfc="" id="mima" type="password" tag="安全密码" placeholder="请输入您的安全密码" class="va124" >
                </td>
            </tr>
            <tr data-v-42392bfc=""></tr>
            </tbody>
        </table>
        <div data-v-42392bfc="" class="loginBtn BTN" style="margin-top: 55px"><a data-v-42392bfc="" onclick="sav()">确定</a></div>
    </div>
    <!--开户银行不为空-->
    <div id="yinhang11" class="layermbox layermbox0 layermshow" index="21" style="display: none;">
        <div class="laymshade"></div>
        <div class="layermmain">
            <div class="section">
                <div class="layermchild layerConfirm layermanim"><h3 style="">温馨提示</h3>
                    <button class="layermend"></button>
                    <div class="layermcont">-请选择开户银行-</div>
                    <div class="layermbtn"><span type="1">确定</span></div>
                </div>
            </div>
        </div>
    </div>
    <!--省不为空-->
    <div id="pro" class="layermbox layermbox0 layermshow" index="21" style="display: none;">
        <div class="laymshade"></div>
        <div class="layermmain">
            <div class="section">
                <div class="layermchild layerConfirm layermanim"><h3 style="">温馨提示</h3>
                    <button class="layermend"></button>
                    <div class="layermcont">-请选择开户省份-</div>
                    <div class="layermbtn"><span type="1">确定</span></div>
                </div>
            </div>
        </div>
    </div>
    <!--市不为空-->
    <div id="cit" class="layermbox layermbox0 layermshow" index="21" style="display: none;">
        <div class="laymshade"></div>
        <div class="layermmain">
            <div class="section">
                <div class="layermchild layerConfirm layermanim"><h3 style="">温馨提示</h3>
                    <button class="layermend"></button>
                    <div class="layermcont">-请选择开户城市-</div>
                    <div class="layermbtn"><span type="1">确定</span></div>
                </div>
            </div>
        </div>
    </div>
    <!--姓名不为空-->
    <div id="ren" class="layermbox layermbox0 layermshow" index="21" style="display: none;">
        <div class="laymshade"></div>
        <div class="layermmain">
            <div class="section">
                <div class="layermchild layerConfirm layermanim"><h3 style="">温馨提示</h3>
                    <button class="layermend"></button>
                    <div class="layermcont">-开户人姓名不能为空-</div>
                    <div class="layermbtn"><span type="1">确定</span></div>
                </div>
            </div>
        </div>
    </div>
    <!--卡号不为空-->
    <div id="ka1" class="layermbox layermbox0 layermshow" index="21" style="display: none;">
        <div class="laymshade"></div>
        <div class="layermmain">
            <div class="section">
                <div class="layermchild layerConfirm layermanim"><h3 style="">温馨提示</h3>
                    <button class="layermend"></button>
                    <div class="layermcont">-银行卡号不能为空-</div>
                    <div class="layermbtn"><span type="1">确定</span></div>
                </div>
            </div>
        </div>
    </div>
    <!--卡号不为空-->
    <div id="ka2" class="layermbox layermbox0 layermshow" index="21" style="display: none;">
        <div class="laymshade"></div>
        <div class="layermmain">
            <div class="section">
                <div class="layermchild layerConfirm layermanim"><h3 style="">温馨提示</h3>
                    <button class="layermend"></button>
                    <div class="layermcont">-确认银行卡号不能为空-</div>
                    <div class="layermbtn"><span type="1">确定</span></div>
                </div>
            </div>
        </div>
    </div>

    <!--卡号的长度-->
    <div id="ka3" class="layermbox layermbox0 layermshow" index="21" style="display: none;">
        <div class="laymshade"></div>
        <div class="layermmain">
            <div class="section">
                <div class="layermchild layerConfirm layermanim"><h3 style="">温馨提示</h3>
                    <button class="layermend"></button>
                    <div class="layermcont">-银行卡号长度必须在16位到19位之间-</div>
                    <div class="layermbtn"><span type="1">确定</span></div>
                </div>
            </div>
        </div>
    </div>
    <!--卡号为数字-->
    <div id="ka4" class="layermbox layermbox0 layermshow" index="21" style="display: none;">
        <div class="laymshade"></div>
        <div class="layermmain">
            <div class="section">
                <div class="layermchild layerConfirm layermanim"><h3 style="">温馨提示</h3>
                    <button class="layermend"></button>
                    <div class="layermcont">-银行卡号必须全为数字-</div>
                    <div class="layermbtn"><span type="1">确定</span></div>
                </div>
            </div>
        </div>
    </div>
    <!--卡号前边几位不符合规范-->
    <div id="ka5" class="layermbox layermbox0 layermshow" index="21" style="display: none;">
        <div class="laymshade"></div>
        <div class="layermmain">
            <div class="section">
                <div class="layermchild layerConfirm layermanim"><h3 style="">温馨提示</h3>
                    <button class="layermend"></button>
                    <div class="layermcont">-银行卡号开头6位不符合规范-</div>
                    <div class="layermbtn"><span type="1">确定</span></div>
                </div>
            </div>
        </div>
    </div>
    <!--确认卡号不为空-->
    <div id="ka6" class="layermbox layermbox0 layermshow" index="21" style="display: none;">
        <div class="laymshade"></div>
        <div class="layermmain">
            <div class="section">
                <div class="layermchild layerConfirm layermanim"><h3 style="">温馨提示</h3>
                    <button class="layermend"></button>
                    <div class="layermcont">-确认卡号不能为空-</div>
                    <div class="layermbtn"><span type="1">确定</span></div>
                </div>
            </div>
        </div>
    </div>
    <!--两次输入的卡号不正确-->
    <div id="ka7" class="layermbox layermbox0 layermshow" index="21" style="display: none;">
        <div class="laymshade"></div>
        <div class="layermmain">
            <div class="section">
                <div class="layermchild layerConfirm layermanim"><h3 style="">温馨提示</h3>
                    <button class="layermend"></button>
                    <div class="layermcont">-两次输入的卡号不正确-</div>
                    <div class="layermbtn"><span type="1">确定</span></div>
                </div>
            </div>
        </div>
    </div>
    <!--两次输入的卡号不正确-->
    <div id="anquanmima" class="layermbox layermbox0 layermshow" index="21" style="display: none;">
        <div class="laymshade"></div>
        <div class="layermmain">
            <div class="section">
                <div class="layermchild layerConfirm layermanim"><h3 style="">温馨提示</h3>
                    <button class="layermend"></button>
                    <div class="layermcont">-安全密码不能为空-</div>
                    <div class="layermbtn"><span type="1">确定</span></div>
                </div>
            </div>
        </div>
    </div>
    <!--安全密码不正确-->
    <div id="buzhengque" class="layermbox layermbox0 layermshow" index="21" style="display: none;">
        <div class="laymshade"></div>
        <div class="layermmain">
            <div class="section">
                <div class="layermchild layerConfirm layermanim"><h3 style="">温馨提示</h3>
                    <button class="layermend"></button>
                    <div class="layermcont">-安全密码不正确，请重新输入-</div>
                    <div class="layermbtn"><span type="1">确定</span></div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--<script src="/style/js/distpicker.data.js"></script>-->
<!--<script src="/style/js/distpicker.js"></script>-->
<!--<script src="/style/js/main.js"></script>-->
<script src="/style/js/common.js"></script>
<script type="text/javascript">if (document.getElementById('load') && confirm('文件加载失败，是否刷新')) {
    location.reload()
}</script>
</body>
</html>
<script>
    $(".layermbtn").click(function(){
        $(this).parents(".layermbox").hide();
    });
    //保存
    function sav(){
        var yinhang = $("#yinhang").val();
        var sheng = $("#province").val();
        var shi = $("#city").val();
        var name = $("#name").val();
        var kahao1 = $("#kahao1").val();
        var kahao2 = $("#kahao2").val();
        var mima = $("#mima").val();
        if(yinhang == ''){
            $("#yinhang11").show();
            return false;
        }
        if(sheng == ''){
            $("#pro").show();
            return false;
        }
        if(shi == ''){
            $("#cit").show();
            return false;
        }
        if(name == ''){
            $("#ren").show();
            return false;
        }
        if(kahao1 == ''){
            $("#ka1").show();
            return false;
        }
        if(kahao2 == ''){
            $("#ka2").show();
            return false;
        }



        if(kahao1.length < 16 || kahao1.length > 19) {
            $("#ka3").show();
            return false;
        }
        var num = /^\d*$/; //全数字
        if(!num.exec(kahao1)) {
            $("#ka4").show();
            return false;
        }
        //开头6位
        var strBin = "10,18,30,35,37,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,58,60,62,65,68,69,84,87,88,94,95,98,99";
        if(strBin.indexOf(kahao1.substring(0, 2)) == -1) {
            $("#ka5").show();
            return false;
        }

        if(kahao2 == ''){
            $("#ka6").show();
            return false;
        }
        if(kahao2 != kahao1){
            $("#ka7").show();
            return false;
        }
        if(mima == ''){
            $("#anquanmima").show();
            return false;
        }

        $.ajax({
            type: "POST",
            url: "{:U('Users/manageBankcard')}",
            data: {'mima':mima,'yinhang':yinhang,'sheng':sheng,'shi':shi,'name':name,'kahao2':kahao2},
            success: function(dat){
                if(dat==0){
                    $("#buzhengque").show();
                    return false;
                }else if(dat==1) {
                    window.location.href="/Users/manageBankcard2";
                }
            }
        });
    }

    function loadRegion(city){
        var province = $("#province").val();
        $.ajax({
            type: "POST",
            url: "{:U('Users/get_city')}",
            data: {'province':province},
            success: function(data){
                $("#city").empty();
                if(data){
                    var ndata = eval(data);
                    $.each(ndata,function(idk,v){
                        $("#city").append('<option value='+v.id+'>'+v.name+'</option>');
                    });
                }else{
                    $("#city").append('<option value="">请选择</option>');
                }
            }
        });
    }

</script>